<html xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录/注册页面</title>
    <link th:href="@{/static/css/bootstrap.css}" rel="stylesheet"/>
    <style>
        .radio_type{
            width: 20px;
            height: 20px;
            appearance: none;
            position: relative;
        }
        .radio_type:before{
            content: '';
            width: 20px;
            height: 20px;
            border: 1px solid #7d7d7d;
            display: inline-block;
            border-radius: 50%;
            vertical-align: middle;
        }
        .radio_type:checked:before{
            content: '';
            width: 20px;
            height: 20px;
            border: 1px solid #c59c5a;
            background:#c59c5a;
            display: inline-block;
            border-radius: 50%;
            vertical-align: middle;
        }
        .radio_type:checked:after{
            content: '';
            width: 10px;
            height:5px;
            border: 2px solid white;
            border-top: transparent;
            border-right: transparent;
            text-align: center;
            display: block;
            position: absolute;
            top: 6px;
            left:5px;
            vertical-align: middle;
            transform: rotate(-45deg);
        }
        .radio_type:checked+label{
            color: #c59c5a;
        }
    </style>
</head>
<body>
<div class="with:50%">
    <form id="saveCustomer" action="/customer/login" method="post" class="form-horizontal">
        <div class="form-group">
            <label class="col-sm-2 control-label">手机号：</label>
            <div class="col-sm-5">
                <input type="text" class="form-control" th:name="phone" placeholder="请输入手机号"/><br/>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label">密码：</label>
            <div class="col-sm-5">
                <input type="password" class="form-control" th:name="password" placeholder="请输入密码" /><br/>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label">验证码：</label>
            <div class="col-sm-5">
                <input type="text" class="form-control" th:name="verifyCode" placeholder="请输入验证码"/><br/>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label">登录方式：</label>
            <div class="col-sm-5">
                验证码： <input type="radio" class="radio_type"  th:name="type" value="1" />
                密码：<input type="radio" class="radio_type" th:name="type" checked="checked" value="2" />
            </div>
        </div>

        <div class="form-group">

            <div class="col-sm-offset-2 col-sm-10">
                <input type="submit" value="登录" class="btn btn-info" />
            </div>
        </div>
    </form>
</div>

</body>
</html>
